<!--
 * @Description: 客户管理_外贸
 * @Version: @1.0.0
 * @Autor: LuLu
 * @Date: 2023-04-12 10:20:00
 * @LastEditors: LuLu
 * @LastEditTime: 2023-07-17 15:27:01
-->
<template>
  <div class="container">
    <div class="search-box">
      <el-row :gutter="20">
        <el-form label-width="100px" size="small" class="searchForm">
          <el-col :span="6">
            <el-form-item label="公司名称:">
              <el-input
                v-model="params.companyName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户邮箱:">
              <el-input
                v-model="params.email"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户姓名:">
              <el-input
                v-model="params.customerName"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="客户等级:">
              <el-select
                v-model="params.grade"
                placeholder="请选择客户等级"
                size="mini"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in levelList"
                  :key="item.gradeValue"
                  :label="item.gradeName"
                  :value="item.gradeValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <!-- {{this.params.customerRole}} -->
            <el-form-item label="客户类型:">
              <el-select
                v-model="params.customerRole"
                clearable
                @change="search"
                multiple
              >
                <el-option
                  v-for="item in levelList3"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="标签:">
              <!-- <el-autocomplete
                class="inline-input"
                v-model="params.label"
                :fetch-suggestions="querySearch"
                placeholder="请输入内容"
                value-key="context"
                clearable
                @change="search"
              ></el-autocomplete> -->
              <el-select
                v-model="params.label"
                clearable
                multiple
                placeholder="请选择标签"
                @change="search"
              >
                <el-option
                  v-for="item in labels"
                  :key="item.id"
                  :label="item.context"
                  :value="item.context"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="来源:">
              <el-select v-model="params.source" clearable @change="search">
                <el-option
                  v-for="item in levelList5"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="国家:">
              <el-select
                v-model="params.country"
                placeholder="请选择国家"
                size="mini"
                clearable
                filterable
                @change="search"
              >
                <el-option
                  v-for="item in countryList"
                  :key="item.id"
                  :label="item.country"
                  :value="item.country"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="洲别:">
              <el-select
                v-model="params.continent"
                placeholder="请选择洲"
                size="mini"
                clearable
                filterable
                @change="search"
              >
                <el-option
                  v-for="item in continentlist"
                  :key="item.label"
                  :label="item.label"
                  :value="item.label"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="最近跟进人:">
              <el-select
                v-model="params.ids"
                filterable
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in sysUserList"
                  :key="item.userId"
                  :label="item.userName"
                  :value="item.userId"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="拜访记录:">
              <el-select v-model="params.isVisit" clearable @change="search">
                <el-option
                  v-for="item in visitList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="6">
            <el-form-item label="职位:" v-if="!openFlag">
              <el-input
                v-model="params.positions"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col> -->

          <!-- <el-col :span="6">
            <el-form-item label="联系电话:" v-if="!openFlag">
              <el-input
                v-model="params.customerPhone"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col> -->
          <!-- <el-col :span="6">
            <el-form-item label="新/老客户:" v-if="!openFlag">
              <el-select
                v-model="params.customerType"
                clearable
                @change="search"
              >
                <el-option
                  v-for="item in typeList1"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <!-- <el-col :span="6">
            <el-form-item label="客户官网:" v-if="!openFlag">
              <el-input
                v-model="params.officialWebsite"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col> -->

          <el-col :span="6">
            <el-form-item label="未联系(天):" v-if="!openFlag">
              <el-input-number
                clearable
                style="width: 120px"
                controls-position="right"
                v-model="params.firstDay"
                :min="1"
                :max="params.lastDay"
                @clear="search"
              ></el-input-number
              >至
              <el-input-number
                clearable
                style="width: 120px"
                controls-position="right"
                v-model="params.lastDay"
                :min="params.firstDay"
                @clear="search"
              ></el-input-number>
              <!-- <el-date-picker v-model="params.beginTime" @change="search" @clear="search" type="date" placeholder="选择日期"></el-date-picker>至 -->
              <!-- <el-date-picker v-model="params.endTime" @change="search" @clear="search" type="date" placeholder="选择日期"></el-date-picker> -->
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="小记:" v-if="!openFlag">
              <el-input
                v-model="params.subtotal"
                size="mini"
                clearable
                @keyup.enter.native="search"
                @clear="search"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="openFlag ? 6 : 2" v-if="openFlag">
            <el-button
              @click="search"
              icon="el-icon-search"
              size="mini"
              type="warning"
              >搜索</el-button
            >
            <el-button
              icon="el-icon-folder-opened"
              type="primary"
              size="mini"
              @click="openSearch"
              >展开</el-button
            >
            <el-button
              @click="cancelData"
              icon="el-icon-circle-close"
              size="mini"
              type="success"
              >重置</el-button
            >
          </el-col>
          <el-col :span="6" v-if="!openFlag">
            <el-button
              @click="search"
              icon="el-icon-search"
              type="warning"
              size="mini"
              >搜索</el-button
            >
            <el-button
              @click="openSearch"
              icon="el-icon-folder-opened"
              type="primary"
              size="mini"
              >收起</el-button
            >
            <el-button
              @click="cancelData"
              icon="el-icon-circle-close"
              size="mini"
              type="success"
              >重置</el-button
            >
          </el-col>
        </el-form>
      </el-row>
    </div>

    <div>
      <div class="handle-box">
        <el-button
          size="mini"
          type="danger"
          icon="el-icon-delete"
          class="handle-del mr10"
          :disabled="multiple"
          @click="delAllSelection"
          >批量删除</el-button
        >
        <el-button
          type="warning"
          size="mini"
          icon="el-icon-plus"
          @click="handleAdd"
          class="mr10"
          >新增客户</el-button
        >
        <!-- 管理员上传 -->
        <!-- <el-upload
          v-loading="uploading"
          class="mr10"
          style="display: inline-block; margin-top: 10px"
          action
          :http-request="uploadFile"
          :limit="1"
          :on-exceed="fileExceed"
          accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          :file-list="uploadList"
          :show-file-list="false"
          ref="fileupload"
          v-hasPermi="['systemSettings:customerManagement:upUsre']"
        >
          <el-button size="mini" type="success" class="el-icon-s-promotion"
            >管理员资源导入</el-button
          >
        </el-upload> -->
        <!-- <el-button
          type="danger"
          size="mini"
          icon="el-icon-delete"
          class="mr10"
          @click="allDel(1)"
          >等级删除</el-button
        > -->
        <!-- 普通上传 -->
        <el-upload
          v-loading="uploading"
          class="mr10"
          style="display: inline-block; margin-top: 10px"
          action
          :http-request="uploadFile2"
          :limit="1"
          :on-exceed="fileExceed"
          accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
          :file-list="uploadList"
          :show-file-list="false"
          ref="fileupload"
        >
          <el-button size="mini" type="primary" class="el-icon-s-promotion"
            >资源导入</el-button
          >
        </el-upload>
        <el-button
          size="mini"
          type="success"
          icon="el-icon-s-promotion"
          class="handle-del mr10"
          :disabled="multiple"
          @click="translate"
          >批量转移</el-button
        >
        <el-button
          type="primary"
          size="mini"
          icon="el-icon-download"
          class="mr10"
          @click="downLoadPan"
          >模板下载</el-button
        >
        <el-button
          type="success"
          size="mini"
          icon="el-icon-view"
          class="mr10"
          @click="diaAppointment"
          >提醒列表
        </el-button>
        <el-button
          type="warning"
          size="mini"
          icon="el-icon-folder-opened"
          class="mr10"
          @click="export1"
          v-hasPermi="['system:customerNei:import']"
        >
          资源导出
        </el-button>
        <el-button
          type="success"
          size="mini"
          icon="el-icon-s-promotion"
          class="mr10"
          @click="toSameCustomer"
          >重复客户
        </el-button>
      </div>
      <!-- //名字模糊搜索 -->
      <el-table
        v-loading="loading"
        :data="tableData"
        :max-height="tableHeight"
        style="width: 100%"
        border
        class="table"
        ref="multipleTable"
        header-cell-class-name="table-header"
        @selection-change="handleSelectionChange"
        @sort-change="handleSortChange"
      >
        <el-table-column
          type="selection"
          width="55"
          align="center"
        ></el-table-column>
        <el-table-column
          fixed
          label="公司名称"
          width="150"
          align="center"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <span
              class="blue"
              style="text-decoration: underline; margin-left: 5px"
              @click="handleEdit(scope.$index, scope.row)"
              >{{ scope.row.companyName }}</span
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="customerName"
          label="客户姓名"
          min-width="140"
          align="center"
          fixed
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          label="国家"
          align="center"
          width="120"
          :show-overflow-tooltip="true"
          fixed
        >
          <template slot-scope="scope">
            {{ scope.row.country }}
          </template>
        </el-table-column>
        <el-table-column label="客户等级" width="140" align="center">
          <template slot-scope="scope">
            <span>{{ formatLevel(scope.row.grade) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户类型" align="center" min-width="100">
          <template slot-scope="scope">
            <!-- <span>{{ formatRole(scope.row.customerRole) }}</span> -->
            <span>{{ scope.row.customerRole }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="positions"
          label="职位"
          align="center"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column label="标签" width="100" align="center">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.label">{{ scope.row.label }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          label="最近小记时间"
          prop="updateTime"
          align="center"
          min-width="125"
          :sortable="'custom'"
        >
          <!-- <template slot-scope="scope">{{ scope.row.updateTime }}</template> -->
          <template slot-scope="scope">{{
            smallTime(scope.row.updateTime)
          }}</template>
        </el-table-column>

        <el-table-column
          label="最新拜访时间"
          prop="visitTime"
          align="center"
          min-width="125"
          :sortable="'custom'"
        >
          <template slot-scope="scope">{{
            FormatTime(scope.row.visitTime)
          }}</template>
        </el-table-column>
        <el-table-column
          label="最近小记内容"
          align="center"
          width="150"
          prop="subtotal"
          :show-overflow-tooltip="true"
        />
        <el-table-column label="来源" align="center" width="120">
          <template slot-scope="scope">
            <span>{{ formatSource(scope.row.source) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="联系电话"
          width="150"
          align="center"
          prop="customerPhone"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="备注"
          align="center"
          width="150"
          prop="remark"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          prop="email"
          label="客户邮箱"
          align="center"
          min-width="160"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column label="客户官网" align="center" min-width="210">
          <template slot-scope="scope">
            <div v-if="scope.row.officialWebsite">
              <div
                v-for="item in scope.row.officialWebsite.split(',')"
                :key="item"
              >
                <a :href="item" target="_blank">{{ item }}</a>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          label="创建时间"
          prop="createTime"
          align="center"
          min-width="160"
          :sortable="'custom'"
        >
          <template slot-scope="scope">{{ scope.row.createTime }}</template>
        </el-table-column>
        <el-table-column
          label="原归属人"
          width="150"
          align="center"
          prop="belongerName"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          prop="userName"
          label="最近跟进人"
          align="center"
          width="150"
        ></el-table-column>
        <!-- <el-table-column
          label="更多电话"
          width="150"
          align="center"
          prop="landlinePhone"
          :show-overflow-tooltip="true"
        >
        </el-table-column> -->
        <el-table-column label="操作" width="250" align="center" fixed="right">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="warning"
              @click="handleOrder(scope.$index, scope.row)"
              >提醒</el-button
            >
            <el-button
              type="primary"
              size="mini"
              @click="handleViewLog(scope.$index, scope.row, '1')"
              >小记</el-button
            >
            <!-- <el-button
              type="success"
              size="mini"
              @click="handleEdit(scope.$index, scope.row)"
              >修改</el-button
            > -->
            <el-button
              type="success"
              size="mini"
              @click="visit(scope.$index, scope.row)"
              >拜访记录</el-button
            >
            <!-- 露露 -->
            <!-- <el-button
              type="warning"
              size="mini"
              @click="logEdit( scope.row)"
              >修改记录</el-button
            > -->
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <pagination
          v-show="pageTotal > 0"
          :total="pageTotal"
          :page.sync="params.pageNum"
          :limit.sync="params.pageSize"
          @pagination="getData00"
        />
      </div>
    </div>
    <el-dialog
      title="选择转移人"
      :visible.sync="translateVisible"
      width="600px"
    >
      <el-select
        v-model="moveUser"
        placeholder="请选择转移人"
        size="mini"
        clearable
        filterable
      >
        <el-option
          v-for="item in peopleLists"
          :key="item.userId"
          :label="item.userName"
          :value="item.userId"
        ></el-option>
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="translateVisible = false" size="small"
          >取消</el-button
        >
        <el-button @click="translate_sub()" type="primary" size="small"
          >确定</el-button
        >
      </span>
    </el-dialog>
    <!-- 客户预约新增 -->
    <el-dialog title="客户提醒" :visible.sync="orderVisible" width="500px">
      <el-form
        ref="ruleForm"
        label-width="100px"
        :model="orderData"
        :rules="rules"
      >
        <el-row>
          <el-col :span="24">
            <el-form-item label="生效时间" prop="remainTime">
               <el-date-picker
      v-model="orderData.remainTime"
      type="datetime"
      placeholder="选择日期时间"
       format="yyyy-MM-dd HH:mm:ss"
                value-format="yyyy-MM-dd HH:mm:ss"
                style="width: 100%"
      default-time="12:00:00">
    </el-date-picker>
              <!-- <el-date-picker
                v-model="orderData.remainTime"
                type="date"
                format="yyyy-MM-dd "
                value-format="yyyy-MM-dd"
                style="width: 100%"
              ></el-date-picker> -->
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注">
              <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入备注"
                v-model="orderData.remark"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button
          @click="orderSubmitForm('ruleForm')"
          type="primary"
          size="small"
          :loading="isLogin"
          >保存</el-button
        >
      </span>
    </el-dialog>

    <el-dialog
      title="客户提醒列表"
      :visible.sync="viewOrderListVisible"
      width="70%"
    >
      <div style="text-align: right">
        <el-button
          type="primary"
          @click="remindAll"
          :disabled="selectDataArrL.length == 0"
          >关闭提醒</el-button
        >
        <!-- <el-button type="dangear" @click="delAll" :disabled="selectDataArrL.length == 0">一键删除</el-button> -->
      </div>
      <el-table
        :data="orderLstData"
        class="table"
        border
        ref="table"
        :row-key="getRowKey"
        @select-all="selectAll"
        @select="selectChange"
        header-cell-class-name="table-header"
        style="margin-top: 10px"
      >
        <el-table-column
          type="selection"
          align="center"
          :reserve-selection="true"
        ></el-table-column>
        <el-table-column
          prop="customerName"
          align="center"
          label="客户姓名"
           width="250"
        ></el-table-column>
        <el-table-column
          prop="companyName"
          align="center"
          width="250"
          label="客户公司"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column label="提醒时间" align="center" width="150">
          <template slot-scope="scope">{{ scope.row.remainTime }}</template>
        </el-table-column>
        <el-table-column label="状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.status == 0" style="color: #e66d06"
              >未提醒</span
            >
            <span v-if="scope.row.status == 1" style="color: green"
              >已提醒</span
            >
          </template>
        </el-table-column>
        <el-table-column
          prop="remark"
          align="center"
           width="200"
           :show-overflow-tooltip="true"
          label="备注"
        ></el-table-column>
        <el-table-column label="操作" min-width="270" align="center">
          <template slot-scope="scope">
            <!-- <el-button @click="handleOrderListRemind(scope.$index,scope.row)" type="warning" icon="el-icon-check" size="mini">已提醒</el-button> -->
            <el-button
              type="success"
              size="mini"
              @click="handleOrderListEdit(scope.$index, scope.row)"
              >更新提醒</el-button
            >
            <el-button
              type="primary"
              size="mini"
              @click="handleViewLog(scope.$index, scope.row, '2')"
              >小记</el-button
            >
            <el-button
              type="danger"
              size="mini"
              @click="handleOrderListDelete(scope.$index, scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <el-pagination
          background
          layout="total, prev, pager, next"
          :current-page="orderParams.pageNum"
          :page-size="orderParams.pageSize"
          :total="orderParamsTotal"
          @current-change="orderPageChange"
        ></el-pagination>
      </div>
    </el-dialog>
    <!-- 修改增加 -->
    <el-dialog
      :title="title666"
      :showClose="false"
      :visible.sync="dialogVisible"
      :close-on-click-modal="close_modal"
      width="1200px"
    >
      <el-form
        :rules="rules2"
        ref="ruleForm"
        :model="formData"
        label-width="130px"
        size="small"
        class="form-box"
      >
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="公司名称" prop="companyName">
              <el-input
                v-model="formData.companyName"
                :disabled="editFlags"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户邮箱" prop="email">
              <el-input v-model="formData.email">
                <el-button
                  slot="append"
                  icon="el-icon-coordinate"
                  @click.stop="yanzheng"
                ></el-button>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户姓名" prop="customerName">
              <el-input v-model="formData.customerName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="职位">
              <el-input autosize v-model="formData.positions"> </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户等级" prop="grade">
              <el-select v-model="formData.grade">
                <el-option
                  v-for="item in levelList"
                  :key="item.gradeValue"
                  :label="item.gradeName"
                  :value="item.gradeValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户类型" prop="customerRole">
              <el-select v-model="formData.customerRole" clearable multiple>
                <el-option
                  v-for="item in levelList3"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="联系电话" prop="customerPhone">
              <el-input v-model="formData.customerPhone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户官网" prop="officialWebsite">
              <el-input v-model="formData.officialWebsite"></el-input>
            </el-form-item>
          </el-col>
          <!-- <el-col :span="8">
            <el-form-item label="更多号码" prop="landlinePhone">
              <el-input v-model="formData.landlinePhone"></el-input>
            </el-form-item>
          </el-col> -->

          <!-- <el-col :span="8">
            <el-form-item label="新/老客户" prop="customerType">
              <el-select v-model="formData.customerType">
                <el-option
                  v-for="item in levelList2"
                  :key="item.id"
                  :label="item.title"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
          <el-col :span="8">
            <el-form-item label="来源" prop="source">
              <!-- <el-input v-model="formData.source"></el-input> -->
              <el-select v-model="formData.source" @change="change123">
                <el-option
                  v-for="item in levelList5"
                  :key="item.dictValue"
                  :label="item.dictLabel"
                  :value="item.dictValue"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="标签">
              <!-- <el-autocomplete
                class="inline-input"
                v-model="formData.label"
                :fetch-suggestions="querySearch"
                placeholder="请输入标签"
                value-key="context"
                clearable
              ></el-autocomplete> -->
              <el-select
                v-model="formData.label"
                clearable
                multiple
                placeholder="请选择标签"
              >
                <el-option
                  v-for="item in labels"
                  :key="item.id"
                  :label="item.context"
                  :value="item.context"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="国家" prop="country">
              <el-select
                v-model="formData.country"
                placeholder="请选择所属国家"
                size="mini"
                clearable
                filterable
                @change="choose_country"
              >
                <el-option
                  v-for="item in countryList"
                  :key="item.id"
                  :label="item.country"
                  :value="item.country"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="州/省" prop="city">
              <el-input v-model="formData.city"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="详细地址" prop="address">
              <el-input v-model="formData.address"></el-input>
            </el-form-item>
          </el-col>
          
        </el-row>
        <el-row>
           <!-- 证书 -->
          <el-col :span="5">
            <!-- 第一个 -->
            <el-form-item prop="certificate" label="公司注册证书">
              <el-upload
                class="upload-demo"
                ref="upload"
                :action="url + '/system/user/profile/uploadFile'"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
              >
                <el-button slot="trigger" size="mini" type="primary"
                  >选取文件</el-button
                >
              </el-upload>
              <div style="margin-left:10px" v-if="formData.certificate">
                <el-button size="mini" @click="onPreview(formData.certificate)"
                  >查 看</el-button
                >
                <el-button
                  size="mini"
                 style="margin:10px 0px 0px 0px;"
                  @click="downloadImg(formData.certificate)"
                  >下 载</el-button
                >
              </div>
            </el-form-item>
          </el-col>
          <!-- 第二个 -->
          <el-col :span="5">
            <el-form-item prop="certificate2">
              <el-upload
                class="upload-demo"
                ref="upload"
                :action="url + '/system/user/profile/uploadFile'"
                :show-file-list="false"
                :on-success="handleAvatarSuccess2"
              >
                <el-button slot="trigger" size="mini" type="primary"
                  >选取文件</el-button
                >
              </el-upload>
              <div style="margin-left:10px" v-if="formData.certificate2">
                <el-button
                  size="mini"
                  @click="onPreview2(formData.certificate2)"
                  >查 看</el-button
                >
                <el-button
                  size="mini"
                  style="margin:10px 0px 0px 0px;"
                  @click="downloadImgtwo(formData.certificate2)"
                  >下 载</el-button
                >
              </div>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item prop="certificate3">
              <el-upload
                class="upload-demo"
                ref="upload"
                :action="url + '/system/user/profile/uploadFile'"
                :show-file-list="false"
                :on-success="handleAvatarSuccess3"
              >
                <el-button slot="trigger" size="mini" type="primary"
                  >选取文件</el-button
                >
              </el-upload>
              <div style="margin-left:10px" v-if="formData.certificate3">
                <el-button
                  size="mini"
                  @click="onPreview3(formData.certificate3)"
                  >查 看</el-button
                >
                <el-button
                  size="mini"
                 style="margin:10px 0px 0px 0px;"
                  @click="downloadImgthree(formData.certificate3)"
                  >下 载</el-button
                >
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="关键背景信息补充">
          <el-input
            type="textarea"
            placeholder="（公司主营业务、最近今年销售量、目前主要供应商等）"
            autosize
            v-model="formData.remark"
          >
          </el-input>
        </el-form-item>
        <!-- <el-form-item label="小计">
          <el-input
            type="textarea"
            placeholder=""
            autosize
            v-model="formData.message"
          >
          </el-input>
        </el-form-item> -->
        <el-row v-if="formData.id">
          <div style="font-size: 16px; font-weight: bold; margin: 10px 0">
            修改记录：
          </div>
          <!-- <el-table
            v-loading="loadingE"
            :data="recordData"
            height="300px"
            border
            class="table"
            ref="multipleTable1"
            header-cell-class-name="table-header"
          >
            <el-table-column  label="公司名称" width="150" align="center" :show-overflow-tooltip="true">
              <template slot-scope="scope">
                <span
                  >{{ scope.row.companyName }}</span
                >
              </template>
            </el-table-column>
            <el-table-column
              prop="customerName"
              label="客户姓名"
              min-width="140"
              align="center"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="国家"
              align="center"
              width="120"
              :show-overflow-tooltip="true"
            >
              <template slot-scope="scope">
                {{scope.row.country}}
              </template>
            </el-table-column>
            <el-table-column label="客户等级" width="140" align="center">
              <template slot-scope="scope">
                <span>{{ formatLevel(scope.row.grade) }}</span>
              </template>
            </el-table-column>
            <el-table-column label="客户类型" align="center" min-width="100">
              <template slot-scope="scope">
                <span>{{ formatRole(scope.row.customerRole) }}</span>
              </template>
            </el-table-column>
            <el-table-column label="标签" width="100" align="center">
              <template slot-scope="scope">
                <el-tag v-if="scope.row.label">{{ scope.row.label }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column label="最近小记时间" prop="updateTime" align="center" min-width="125" :sortable="'custom'">
              <template slot-scope="scope">{{ smallTime(scope.row.updateTime) }}</template>
            </el-table-column>
            <el-table-column label="来源" align="center" width="120">
              <template slot-scope="scope">
                <span>{{ formatSource(scope.row.source) }}</span>
              </template>
            </el-table-column>
            <el-table-column
              label="联系电话"
              width="150"
              align="center"
              prop="customerPhone"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              label="备注"
              align="center"
              width="150"
              prop="remark"
              :show-overflow-tooltip="true"
            />
            <el-table-column
              prop="email"
              label="客户邮箱"
              align="center"
              min-width="160"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="客户官网"
              align="center"
              min-width="210"
            >
              <template slot-scope="scope">
                <div v-if="scope.row.officialWebsite">
                  <div v-for="item in scope.row.officialWebsite.split(',')" :key="item">
                    <a :href="item" target="_blank">{{item}}</a>
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table> -->
          <el-table
            v-loading="loadingE"
            :data="recordData"
            max-height="300px"
            border
            class="table"
            ref="multipleTable1"
            header-cell-class-name="table-header"
          >
            <el-table-column
              label="修改时间"
              width="150"
              align="center"
              prop="updateTime"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="userName"
              label="修改人"
              width="150"
              align="center"
              :show-overflow-tooltip="true"
            ></el-table-column>
            <el-table-column
              label="修改内容"
              align="center"
              prop="content"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
          </el-table>
          <div style="margin-top: 20px" class="pagination">
            <el-pagination
              background
              layout="total, prev, pager, next"
              :current-page="paramsRecord.pageNum"
              :page-size="paramsRecord.pageSize"
              :total="edPageTotal"
              @current-change="edPageChange"
            ></el-pagination>
          </div>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false" size="small">取消</el-button>
        <el-button
          @click.stop="submitForm()"
          type="primary"
          size="small"
          :disabled="disabled"
          >确定</el-button
        >
      </span>
    </el-dialog>
    <!-- <el-dialog
      title="添加标签"
      :visible.sync="dialogVisible555"
      width="800px"
      @close="close666"
    >
      <el-row>
        <div>
          <span style="display: block; margin-bottom: 10px; font-weight: blod"
            >标签名称:</span
          >
          <el-autocomplete
            class="inline-input"
            v-model="label"
            :fetch-suggestions="querySearch"
            placeholder="请输入内容"
            value-key="context"
            clearable
          ></el-autocomplete>
        </div>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="up" type="primary" size="small">确定</el-button>
      </span>
    </el-dialog> -->
    <el-dialog
      title="添加标签"
      :visible.sync="dialogVisible666"
      width="800px"
      @close="close666"
    >
      <el-row>
        <div>
          <span style="display: block; margin-bottom: 10px; font-weight: blod"
            >标签名称:</span
          >
          <!-- <el-autocomplete
            class="inline-input"
            v-model="label"
            :fetch-suggestions="querySearch"
            placeholder="请输入内容"
            value-key="context"
            clearable
          ></el-autocomplete> -->
          <el-select v-model="label" clearable placeholder="请选择标签">
            <el-option
              v-for="item in labels"
              :key="item.id"
              :label="item.context"
              :value="item.context"
            ></el-option>
          </el-select>
        </div>
      </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="up2" type="primary" size="small">确定</el-button>
      </span>
    </el-dialog>
    <!-- 资质查看弹框 -->
    <el-dialog title="资质查看" :visible.sync="dialogVisible888" width="1200px">
      <el-table
        :data="applyListData888"
        max-height="500"
        border
        class="table"
        ref="multipleTable1"
        header-cell-class-name="table-header"
      >
        <el-table-column
          prop="name"
          label="资质名称"
          align="center"
        ></el-table-column>
        <el-table-column label="资质生效时间" align="center" width="160">
          <template slot-scope="scope">{{ scope.row.startDate }}</template>
        </el-table-column>
        <el-table-column label="资质到期时间" align="center" width="160">
          <template slot-scope="scope">{{ scope.row.endDate }}</template>
        </el-table-column>
        <el-table-column
          label="颁证日期"
          prop="certifiedTime"
          align="center"
          width="160"
        ></el-table-column>
        <el-table-column label="证书状态" align="center" width="100">
          <template slot-scope="scope">
            <span
              class="blue1"
              v-if="
                scope.row.certificateState == '有效' ||
                  scope.row.certificateState == '使用中'
              "
              >{{ scope.row.certificateState }}</span
            >
            <span class="yellow" v-else>{{ scope.row.certificateState }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="颁证机构"
          prop="certifiedOrg"
          align="center"
        ></el-table-column>
      </el-table>
      <!-- <div class="block pageNum" style="text-align:right">
        <el-pagination
          @current-change="handleCurrentChange888"
          :page-size="10"
          layout="total, prev, pager, next"
          :current-page="pageNum888"
          :total="todelpage888"
        ></el-pagination>
      </div> -->
    </el-dialog>
    <!-- 日志查看 -->
    <logDialog
      :corporateNameTitle="corporateNameTitle"
      :logDialogVisible.sync="logDialogVisible"
      @closeDialog="logCloseDialog"
      ref="mychildlog"
    />
    <!-- 预约列表 -->
    <el-dialog
      title="预约列表"
      :visible.sync="ifAppointment"
      width="1000px"
      class="viewLog"
    >
      <el-table
        v-loading="loading"
        :data="appointmentData"
        height="300px"
        border
        class="table"
        ref="multipleTable1"
        header-cell-class-name="table-header"
      >
        <el-table-column
          label="公司名称"
          width="150"
          align="center"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.companyName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="customerName"
          label="客户姓名"
          min-width="140"
          align="center"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column
          label="国家"
          align="center"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            {{ scope.row.country }}
          </template>
        </el-table-column>
        <el-table-column label="客户等级" width="140" align="center">
          <template slot-scope="scope">
            <span>{{ formatLevel(scope.row.grade) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户类型" align="center" min-width="100">
          <template slot-scope="scope">
            <span>{{ formatRole(scope.row.customerRole) }}</span>
          </template>
        </el-table-column>
        <el-table-column label="标签" width="100" align="center">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.label">{{ scope.row.label }}</el-tag>
          </template>
        </el-table-column>
        <el-table-column
          label="最近小记时间"
          prop="updateTime"
          align="center"
          min-width="125"
          :sortable="'custom'"
        >
          <!-- <template slot-scope="scope">{{ scope.row.updateTime }}</template> -->
          <template slot-scope="scope">{{
            smallTime(scope.row.updateTime)
          }}</template>
        </el-table-column>
        <el-table-column
          label="最近小记内容"
          align="center"
          width="150"
          prop="subtotal"
          :show-overflow-tooltip="true"
        />
        <el-table-column label="来源" align="center" width="120">
          <template slot-scope="scope">
            <span>{{ formatSource(scope.row.source) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="联系电话"
          width="150"
          align="center"
          prop="customerPhone"
          :show-overflow-tooltip="true"
        >
        </el-table-column>
        <el-table-column
          label="备注"
          align="center"
          width="150"
          prop="remark"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          prop="email"
          label="客户邮箱"
          align="center"
          min-width="160"
          :show-overflow-tooltip="true"
        ></el-table-column>
        <el-table-column label="客户官网" align="center" min-width="210">
          <template slot-scope="scope">
            <div v-if="scope.row.officialWebsite">
              <div
                v-for="item in scope.row.officialWebsite.split(',')"
                :key="item"
              >
                <a :href="item" target="_blank">{{ item }}</a>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          label="创建时间"
          prop="createTime"
          align="center"
          min-width="160"
          :sortable="'custom'"
        >
          <template slot-scope="scope">{{ scope.row.createTime }}</template>
        </el-table-column>
        <el-table-column
          prop="userName"
          label="最近跟进人"
          align="center"
          width="150"
        ></el-table-column>
      </el-table>
      <div style="margin-top: 20px" class="pagination">
        <el-pagination
          background
          layout="total, prev, pager, next"
          :current-page="paramsRecord.pageNum"
          :page-size="paramsRecord.pageSize"
          :total="edPageTotal"
          @current-change="edPageChange"
        ></el-pagination>
      </div>
    </el-dialog>

    <!-- 修改记录 -->
    <el-dialog
      title="修改记录"
      :visible.sync="edDialog"
      width="1000px"
      class="viewLog"
    >
      <div class="container">
        <div class="handle-box">
          <!-- <el-button
          size="small"
          type="primary"
          icon="el-icon-plus"
          @click="handleAdd"
          class="mr10"
          >新增</el-button
        > -->
        </div>
        <el-table
          v-loading="loadingE"
          :data="recordData"
          height="300px"
          border
          class="table"
          ref="multipleTable1"
          header-cell-class-name="table-header"
        >
          <el-table-column
            label="公司名称"
            width="150"
            align="center"
            :show-overflow-tooltip="true"
          >
            <template slot-scope="scope">
              <span>{{ scope.row.companyName }}</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="customerName"
            label="客户姓名"
            min-width="140"
            align="center"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column
            label="国家"
            align="center"
            width="120"
            :show-overflow-tooltip="true"
          >
            <template slot-scope="scope">
              {{ scope.row.country }}
            </template>
          </el-table-column>
          <el-table-column label="客户等级" width="140" align="center">
            <template slot-scope="scope">
              <span>{{ formatLevel(scope.row.grade) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="客户类型" align="center" min-width="100">
            <template slot-scope="scope">
              <span>{{ formatRole(scope.row.customerRole) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="标签" width="100" align="center">
            <template slot-scope="scope">
              <el-tag v-if="scope.row.label">{{ scope.row.label }}</el-tag>
            </template>
          </el-table-column>
          <el-table-column
            label="最近小记时间"
            prop="updateTime"
            align="center"
            min-width="125"
            :sortable="'custom'"
          >
            <!-- <template slot-scope="scope">{{ scope.row.updateTime }}</template> -->
            <template slot-scope="scope">{{
              smallTime(scope.row.updateTime)
            }}</template>
          </el-table-column>

          <el-table-column label="来源" align="center" width="120">
            <template slot-scope="scope">
              <span>{{ formatSource(scope.row.source) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="联系电话"
            width="150"
            align="center"
            prop="customerPhone"
            :show-overflow-tooltip="true"
          >
          </el-table-column>
          <el-table-column
            label="备注"
            align="center"
            width="150"
            prop="remark"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            prop="email"
            label="客户邮箱"
            align="center"
            min-width="160"
            :show-overflow-tooltip="true"
          ></el-table-column>
          <el-table-column label="客户官网" align="center" min-width="210">
            <template slot-scope="scope">
              <div v-if="scope.row.officialWebsite">
                <div
                  v-for="item in scope.row.officialWebsite.split(',')"
                  :key="item"
                >
                  <a :href="item" target="_blank">{{ item }}</a>
                </div>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div style="margin-top: 20px" class="pagination">
          <el-pagination
            background
            layout="total, prev, pager, next"
            :current-page="paramsRecord.pageNum"
            :page-size="paramsRecord.pageSize"
            :total="edPageTotal"
            @current-change="edPageChange"
          ></el-pagination>
        </div>
      </div>
    </el-dialog>

    <!-- 拜访记录 -->
    <el-dialog title="拜访记录" width="60%" :visible.sync="outerVisible">
      <el-button type="primary" @click="addVisit">新增记录</el-button>
      <el-form
        ref="ruleForm"
        :model="formData"
        label-width="auto"
        size="small"
        style="margin-top: 30px"
        class="form-box"
      >
        <el-row :gutter="24">
          <el-col :span="8">
            <el-form-item label="公司名称：" prop="companyName">
              <el-input v-model="formData.companyName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="客户姓名：" prop="customerName">
              <el-input v-model="formData.customerName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="国家：" prop="country">
              <el-input v-model="formData.country"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

        <div style="font-size: 16px; font-weight: bold; margin: 10px 0">
          纪要信息：
        </div>
        <!-- max-height="400px" -->
        <el-table
          v-loading="loadingE"
          :data="visitData"
          ref="table"
          border
          class="table"
          header-cell-class-name="table-header"
        >
          <el-table-column
            label="记录时间"
            width="150"
            align="center"
            prop="createTime"
          >
            <template slot-scope="{ row }">
              {{ FormatTime(row.createTime) }}
            </template>
          </el-table-column>
          <el-table-column
            label="拜访时间"
            width="150"
            align="center"
            prop="visitTime"
          >
            <template slot-scope="{ row }">
              {{ FormatTime(row.visitTime) }}
            </template>
          </el-table-column>
          <el-table-column
            label="拜访内容"
            prop="content"
            align="center"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <div
                style="
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              width: 100%;
              height: 34px;
              text-align: canter;
            "
                v-html="scope.row.content"
              ></div>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" width="150">
            <template #default="scope">
              <span v-if="scope.row.id == currentIndex">
                <el-button type="text" @click="toogleExpand(scope.row, '收起')"
                  >收起 <i class="el-icon-caret-top"></i
                ></el-button>
              </span>
              <span v-else>
                <el-button type="text" @click="toogleExpand(scope.row, '展开')"
                  >展开 <i class="el-icon-caret-bottom"></i
                ></el-button>
              </span>
            </template>
          </el-table-column>
          <el-table-column type="expand" width="1">
            <template #default="props">
              <el-form label-position="left" inline class="demo-table-expand">
                <el-form-item label="拜访内容：">
                  <p v-html="props.row.content"></p>
                </el-form-item>
              </el-form>
            </template>
          </el-table-column>
        </el-table>
      </el-form>
      <el-dialog
        width="85%"
        title="新增"
        :visible.sync="innerVisible"
        append-to-body
      >
        <el-form
          ref="ruleForm"
          label-width="auto"
          :model="visitForm"
          :rules="rules"
        >
          <el-form-item label="拜访时间" prop="timeValue">
            <el-date-picker
              v-model="visitForm.timeValue"
              type="date"
              placeholder="选择日期"
              :picker-options="endDatePicker"
              value-format="yyyy-MM-dd"
            >
            </el-date-picker>
          </el-form-item>

          <el-form-item label="拜访内容" prop="content">
            <Editor v-model="visitForm.content"></Editor>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="innerVisible = false" size="small">取消</el-button>
          <el-button
            @click="submitVisit('ruleForm')"
            type="primary"
            size="small"
            >确定</el-button
          >
        </span>
      </el-dialog>
      <div slot="footer" class="dialog-footer"></div>
    </el-dialog>
    <!-- 公司证书 -->
    <el-dialog
      :visible.sync="pdfPreviewDialog"
      title="公司注册证书"
      width="50%"
      center
    >
      <pdf :src="pdfSrc" v-for="item in numPages" :key="item" :page="item" style="width:100%" ref="pdf"></pdf>
    </el-dialog>
    <el-dialog
      :visible.sync="pdfPreviewDialog2"
      title="公司注册证书"
      width="50%"
      center
    >
      <el-image style="width: 100%;" :src="pdfSrc2"></el-image>
    </el-dialog>
  </div>
</template>
<script>
// import {mapGetters, mapActions, mapState, mapMutations} from "vuex";
import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
import {
  allDel,
  callNumber,
  getList,
  execlSubmitForm,
  handleOrderListDelete,
  getRemains,
  orderSubmitForm,
  deleteData,
  getData00,
  uploadFile,
  submitAptitudeForm,
  submitAptitudeForm2,
  update,
  downLoadPan,
  submitFormadd,
  getLabels,
  userList,
  addRecord,
  getCountryList,
  exportWai,
  validateEmail,
  record,
  getVisitList,
  addVisit
} from "@/api/systemSettings/customerManagement";
import { listUser } from "@/api/systemSettings/resource";
import { edreserve } from "@/api/index";
import { list } from "@/api/systemSettings/grade";

import logDialog from "./logDialog.vue";
// import contractDialog from "./contractDialog.vue";
// 富文本组件
import Editor from "@/components/Editor/editorMent";
import { getToken } from "@/utils/auth";
import pdf from "vue-pdf";
import { saveAs } from "file-saver";
export default {
  components: { logDialog, Editor,pdf },
  data() {
    this.submitForm = this.throttle(this.submitForm, 1500);
    return {
      // 时间选择器
      endDatePicker: {
        disabledDate: time => {
          const nowData = new Date();
          return time > nowData;
        }
      },
      // 拜访记录
      outerVisible: false,
      innerVisible: false,
      visitData: [],
      visitId: "",
      visitForm: {
        timeValue: "",
        content: ""
      },
pdfPreviewDialog: false,
      pdfPreviewDialog2: false,
      pdfSrc: "",
      numPages: null, // pdf 总页数
      pdfSrc2: "",
      currentIndex: null,
      // timeValue: "", //时间选择绑定
      visitList: [
        {
          value: "-1",
          label: "全部"
        },
        {
          value: "0",
          label: "未拜访"
        },
        {
          value: "1",
          label: "已拜访"
        }
      ],
      // 修改记录
      headers: { Authorization: "Bearer " + getToken() },
      // url: `http://192.168.1.34:8085/prod-api`,
       url: `http://dahsolar.saipaisi.cn:10088/prod-api`,
      // =end

      loadingE: false,
      recordData: [],
      paramsRecord: {
        pageNum: 1,
        pageSize: 10
      },
      edPageTotal: 0,
      customerId: "",
      // 转移
      countryList: [],
      translateVisible: false,
      peopleLists: [],
      moveUser: undefined,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      labels: [],
      cont: undefined,
      sysUserList: [],
      label: "",
      uploadFile666: {},
      dialogVisible555: false,
      dialogVisible666: false,
      dialogVisible888: false,
      applyListData888: [],
      // pageNum888:1,
      // todelpage888:0,
      uploading: false,
      openFlag: true,
      title666: "",
      addVisible: false,
      del: false,
      uploadList: [],
      loading: true,
      //tHeight:document.body.offsetHeight - 350,
      //数据
      tableData: [],
      tableHeight: 0,
      // 参数
      paramsFlag: 0,
      continentlist: [
        {
          value: "亚洲",
          label: "亚洲"
        },
        {
          value: "北美洲",
          label: "北美洲"
        },
        {
          value: "南美洲",
          label: "南美洲"
        },
        {
          value: "大洋洲",
          label: "大洋洲"
        },
        {
          value: "欧洲",
          label: "欧洲"
        },
        {
          value: "非洲",
          label: "非洲"
        }
      ],
      params: {
        pageNum: 1,
        pageSize: 10,
        userId: 1,
        companyName: "",
        customerName: "",
        email: "",
        grade: "",
        source: "",
        day: null,
        relation: null,
        label: "",
        customerRole: "",
        country: "",
        customerPhone: "",
        userName: "",
        officialWebsite: "",
        ids: "",
        subtotal: "",
        isVisit: "",
        visitTime: ""
      },
      pageTotal: 0,
      orderParamsTotal: 0,
      dialogVisible: false, // 是否展示编辑页面
      // 数据
      formData: {},
      dialogStatus: 0,
      //资质查看
      viewDialogVisible: false,
      //日志查看
      logDialogVisible: false,
      //合同列表
      logDiaContractVisible: false,
      stateList: [
        {
          id: 1,
          title: "已合作"
        },
        {
          id: 2,
          title: "有意向"
        },
        {
          id: 3,
          title: "待开发"
        }
      ],
      moveStatList: [
        {
          id: 0,
          title: "正常"
        },
        {
          id: 1,
          title: "待迁移"
        }
      ],
      levelList: [],
      levelList3: [],
      levelList5: [],
      levelList2: [
        // {
        //   id: "0",
        //   title: "未知",
        // },
        {
          id: "1",
          title: "新客户"
        },
        {
          id: "2",
          title: "老客户"
        }
      ],
      qccQuery: [
        {
          id: true,
          title: "已查"
        },
        {
          id: false,
          title: "未查"
        }
      ],

      //转移申请
      rules: {
        // 拜访记录
        timeValue: [
          { required: true, message: "请选择时间", trigger: "change" }
        ],
        content: [{ required: true, message: "请输入内容", trigger: "change" }],
        // ===end
        targetUid: [
          { required: true, message: "请输入被转移人", trigger: "change" }
        ],
        type: [
          { required: true, message: "请选择申请类型", trigger: "change" }
        ],
        ids: [{ required: true, message: "请选择转移客户", trigger: "change" }],
        remainTime: [
          { required: true, message: "请选择预约时间", trigger: "change" }
        ],
        ExeclParams: [
          {
            required: true,
            message: "客户资源导出数量不能为空",
            trigger: "blur"
          }
        ]
      },
      rules2: {
        // landlinePhone: [
        //   { required: true, message: "请输入座机电话", trigger: "change" },
        // ],
        email: [
          { required: true, message: "邮箱地址不能为空", trigger: "blur" }
          // {
          //   type: "email",
          //   message: "'请输入正确的邮箱地址",
          //   trigger: ["blur", "change"],
          // },
        ],
        // customerPhone: [
        //   { required: true, message: "请输入联系电话", trigger: "blur" },
        // ],
        companyName: [
          { required: true, message: "请输入公司名称", trigger: "blur" }
        ],
        country: [{ required: true, message: "请选择国家", trigger: "blur" }],
        customerName: [
          { required: true, message: "请输入联系人", trigger: "blur" }
        ],
        // address: [
        //   { required: true, message: "请输入地址", trigger: "blur" },
        // ],
        customerRole: [
          { required: true, message: "请选择客户类型", trigger: "blur" }
        ],
        grade: [{ required: true, message: "请选择客户等级", trigger: "blur" }],
        customerType: [
          { required: true, message: "请选择新老客户", trigger: "blur" }
        ],
        source: [{ required: true, message: "请输入客户来源", trigger: "blur" }]
      },
      isLogin: false,
      applyVisible: false,
      sysUserList: [],
      close_modal: false,
      applyData: {
        //   sourceUid:JSON.parse( localStorage.getItem('adminData') ).id,
        type: "",
        targetUid: "",
        ids: "",
        reason: ""
      },
      typeList: [
        {
          title: "部分转移",
          id: 1
        },
        {
          title: "全部转移",
          id: 2
        }
      ],
      typeList1: [
        {
          id: "1",
          title: "新客户"
        },
        {
          id: "2",
          title: "老客户"
        }
      ],
      //查看申请
      viewApplyVisible: false,
      // adminId:JSON.parse( localStorage.getItem('adminData') ).id,
      ApplyListParams: {
        pageNum: 1,
        pageSize: 10
      },
      applyListData: [],
      applyListPage: 0,
      statelList: [
        {
          id: "0",
          title: "未审核"
        },
        {
          id: "1",
          title: "通过"
        },
        {
          id: "2",
          title: "拒绝"
        }
      ],
      applyDetailVisible: false,
      customerListParams: {
        pageNum: 1,
        pageSize: 10
      },
      customerListParamsTotal: 0,
      customerListDataMore: [],
      statusData: [
        {
          id: 0,
          title: "未审核"
        },
        {
          id: 1,
          title: "已审核"
        },
        {
          id: 2,
          title: "全部"
        }
      ],
      status: "",
      //客户预约
      orderVisible: false,
      orderData: {},
      selectDataArrL: [],
      orderDialogStatus: "",
      viewOrderListVisible: false,
      orderLstData: [],
      messageContent: "",
      //表格导出
      ExeclParamsdata: {
        ExeclParams: ""
      },
      addExeclVisible: false,
      editFlags: false,
      // 转移人员
      transferPeopleParams: {
        pageNum: 1,
        pageSize: 10,
        companyName: "",
        realName: "",
        grade: ""
      },
      options: [],
      corporateNameTitle: "",
      contractFlag: true,
      orderParams: {
        pageNum: 1,
        pageSize: 10
      },
      translate_data: {},
      prop: "updateTime",
      sort: "descending",
      // 修改记录
      edDialog: false,
      // 修改记录列表
      edLogTable: [],
      // 预约弹窗
      ifAppointment: false,
      appointmentData: [],
      appointmentParams: {
        pageNum: 1,
        pageSize: 10
      },
      appointmentTotal: 0,
      disabled: false
    };
  },
  //名字模糊搜索 列表数组是tableData,计算属性实现模糊查询用的fillist数组
  // computed: {
  //   fillist() {
  //     if (!this.params.companyName) {
  //       return this.tableData;
  //     }
  //     return this.tableData.filter(v => {
  //       return v.companyName.includes(this.params.companyName);
  //     });
  //   }
  // },
  created() {
    console.log(this.$store.state.notice.ifNotice);
    // if (this.$route.params.id && !this.$route.params.userName) {
    //   this.params.grade = this.$route.params.id;
    //   this.getData00();
    // } else if (!this.$route.params.id && this.$route.params.userName) {
    //   this.params.nickName = this.$route.params.userName;
    //   this.getData00();
    // } else {
    //   this.getData00();
    // }
    // 判断是否是公告跳转过来
    if (this.$store.state.notice.ifNotice) {
      this.params.companyName = this.$store.state.notice.couName;
    }

    if (this.$route.params.id) {
      this.openFlag = !this.openFlag;
      this.params.grade = this.$route.params.id;
      this.getData00();
    } else if (this.$route.params.day) {
      this.openFlag = !this.openFlag;
      this.params.day = this.$route.params.day;
      this.params.relation = "0";
      this.getData00();
    } else {
      this.getData00();
    }
    this.getDicts("qudao").then(res => {
      this.levelList5 = res.data;
      console.log(res.data, "yuanshi");
      // console.log(this.levelList5,'12')
    });
    // this.getRemains();
    this.getSysUserList();
  },
  mounted() {
    this.$nextTick(function() {
      this.tableHeight =
        window.innerHeight - this.$refs.multipleTable.$el.offsetTop - 200;
      let self = this;
      window.onresize = function() {
        self.tableHeight =
          window.innerHeight - self.$refs.multipleTable.$el.offsetTop - 200;
      };
      // console.log(self.tableHeight,'表格高度')
      console.log(window.innerHeight, "");
    });
    this.getDicts("customerRole").then(response => {
      this.levelList3 = response.data;
    });
    this.peopleList();
    this.getLabels();
    this.grades();
    this.getCountryList();
    // this.getList();
  },
  watch: {
    selectDataArrL(val) {
      console.log(val);
    }
  },
  filters: {
    formatDate: function(value) {
      /* let date = new Date(parseInt(value) * 1000);
        let y = date.getFullYear();
        let m = date.getMonth() + 1;
        m = m < 10 ? "0" + m : m;
        let d = date.getDate();
        d = d < 10 ? "0" + d : d;
        return y+'-'+m + "-" + d;*/
      let date = new Date(parseInt(value) * 1000);
      let y = date.getFullYear();
      let m = date.getMonth() + 1;
      m = m < 10 ? "0" + m : m;
      let d = date.getDate();
      d = d < 10 ? "0" + d : d;
      let h = date.getHours();
      h = h < 10 ? "0" + h : h;
      let minute = date.getMinutes();
      let second = date.getSeconds();
      minute = minute < 10 ? "0" + minute : minute;
      second = second < 10 ? "0" + second : second;
      return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
    }
  },
  methods: {
    
    // 露露修改
     // # 计算pdf页码总数
    getNumPages(pdfSrc) {
      let loadingTask = pdf.createLoadingTask(pdfSrc)
      loadingTask.promise.then(pdf => {
        this.numPages = pdf.numPages
      }).catch(err => {
        console.error('pdf 加载失败', err);
      })
    },
    // 查看证书
    onPreview(file) {
      if (file.includes(".pdf")) {
        this.getNumPages(file)
        this.pdfSrc = pdf.createLoadingTask(file);
        this.pdfPreviewDialog = true;
      } else {
        this.pdfSrc2 = file;
        this.pdfPreviewDialog2 = true;
        // this.$refs.preview.clickHandler();
      }
    },
    onPreview2(file) {
      if (file.includes(".pdf")) {
          this.getNumPages(file)
        this.pdfSrc = pdf.createLoadingTask(file);
        this.pdfPreviewDialog = true;
      } else {
        // this.$refs.preview2.clickHandler();
        this.pdfSrc2 = file;
        this.pdfPreviewDialog2 = true;
      }
    },
    onPreview3(file) {
      if (file.includes(".pdf")) {
          this.getNumPages(file)
        this.pdfSrc = pdf.createLoadingTask(file);
        this.pdfPreviewDialog = true;
      } else {
        // this.$refs.preview3.clickHandler();
        this.pdfSrc2 = file;
        this.pdfPreviewDialog2 = true;
      }
    },
    // 下载证书
    downloadImg(file) {
      let that = this;
       console.log(file);
      if (file.includes(".pdf")) {
        var oReq = new XMLHttpRequest();
        var URL = file; // URL 为URL地址
        oReq.open("GET", URL, true);
        console.log(URL);
        oReq.responseType = "blob";
        oReq.onload = function() {
          var file = new Blob([oReq.response], {
            type: "blob"
          });
          saveAs(file, "证书.pdf"); // that.name为文件名
        };
        oReq.send();
      } else {
        that.downCode(that.formData.certificate, "证书");
      }
    },
    downloadImgtwo(file) {
       let that = this;
      if (file.includes(".pdf")) {
        var oReq = new XMLHttpRequest();
        var URL = file; // URL 为URL地址
        oReq.open("GET", URL, true);
        oReq.responseType = "blob";
        oReq.onload = function() {
          var file = new Blob([oReq.response], {
            type: "blob"
          });
          saveAs(file, "证书.pdf"); // that.name为文件名
        };
        oReq.send();
      } else {
        that.downCode(that.formData.certificate2, "证书");
      }
    },
    downloadImgthree(file) {
      let that = this;
      if (file.includes(".pdf")) {
        var oReq = new XMLHttpRequest();
        var URL = file; // URL 为URL地址
        oReq.open("GET", URL, true);
        oReq.responseType = "blob";
        oReq.onload = function() {
          var file = new Blob([oReq.response], {
            type: "blob"
          });
          saveAs(file, "证书.pdf"); // that.name为文件名
        };
        oReq.send();
      } else {
        that.downCode(that.formData.certificate3, "证书");
      }
    },
    downCode(imgsrc, name) {
      var image = new Image();
      // 解决跨域 Canvas 污染问题
      image.setAttribute("crossOrigin", "anonymous");
      image.onload = function() {
        var canvas = document.createElement("canvas");
        canvas.width = image.width;
        canvas.height = image.height;
        var context = canvas.getContext("2d");
        context.drawImage(image, 0, 0, image.width, image.height);
        var url = canvas.toDataURL("image/png");
        var a = document.createElement("a");
        // 创建一个单击事件
        var event = new MouseEvent("click");
        a.download = name;
        a.href = url;
        // 触发a的单击事件
        a.dispatchEvent(event);
      };
      image.src = imgsrc;
      this.$message.success("下载成功");
    },

    // 证书注册证书
    // 上传图片
    handleAvatarSuccess(res, file) {
      let that = this;
      if (res.code == "200") {
        that.$set(that.formData, "certificate", res.data);
        that.formData.certificate = this.url + res.msg; //上传成功后端返回视频地址 回显
        that.$message.success("上传成功！");
      } else {
        that.$message.error("上传失败！");
      }
    },
    handleAvatarSuccess2(res, file) {
      let that = this;
      if (res.code == "200") {
        that.$set(that.formData, "certificate2", res.data);
        that.formData.certificate2 = this.url + res.msg; //上传成功后端返回视频地址 回显
        that.$message.success("上传成功！");
      } else {
        that.$message.error("上传失败！");
      }
    },
    handleAvatarSuccess3(res, file) {
      let that = this;
      if (res.code == "200") {
        that.$set(that.formData, "certificate3", res.data);
        that.formData.certificate3 = this.url + res.msg; //上传成功后端返回视频地址 回显
        that.$message.success("上传成功！");
      } else {
        that.$message.error("上传失败！");
      }
    },
    toogleExpand(row, text) {
      if (text == "展开") {
        this.visitData.map(item => {
          if (row.id != item.id) {
            console.log();
            this.$refs.table.toggleRowExpansion(item, false);
          }
        });
        this.currentIndex = row.id;
        this.Text = "收起";
      } else {
        this.currentIndex = null;
        this.Text = "展开";
      }
      this.$refs.table.toggleRowExpansion(row);
    },
    // 拜访记录
    visit(index, row) {
      this.outerVisible = true;
      this.visitId = row.id;
      submitAptitudeForm2(row.id).then(res => {
        if (res.code == 200) {
          this.formData = res.data;
        } else {
          this.$message.error(res.msg);
        }
      });
      this.getVisitList();
    },
    getVisitList() {
      getVisitList(this.visitId).then(res => {
        if (res.code == 200) {
          this.visitData = res.data;
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    // 打开拜访记录内新增弹框
    //保存数据
    submitVisit(ruleForm) {
      this.$refs[ruleForm].validate(valid => {
        if (valid) {
          addVisit({
            customerId: this.visitId,
            content: this.visitForm.content,
            visitTime: this.visitForm.timeValue
          })
            .then(res => {
              if (res.code != 200) {
                setTimeout(() => {
                  this.isLogin = false;
                  this.$message.error("添加失败");
                }, 0.1 * 1000);
              } else {
                setTimeout(() => {
                  this.isLogin = false;
                  this.$message.success("添加成功");
                  this.innerVisible = false;
                  this.getVisitList();
                }, 0.1 * 1000);
              }
            })
            .catch(() => {
              this.isLogin = false;
            });
        }
      });
    },
    addVisit() {
      this.visitForm = {
        timeValue: "",
        content: ""
      };
      this.innerVisible = true;
    },
    // 拜访记录 end
    // 露露修改end
    throttle(func, wait) {
      let timeout = null;
      return function() {
        const context = this;
        const args = arguments;
        if (!timeout) {
          timeout = setTimeout(() => {
            timeout = null;
            func.apply(context, args);
          }, wait);
        }
      };
    },
    closeDiaVis() {
      // this.$confirm('是否关闭?', '提示', {
      //   confirmButtonText: '确定',
      //   cancelButtonText: '取消',
      //   type: 'warning'
      // }).then(() => {
      //   this.dialogVisible = false
      // }).catch(() => {
      // });
    },
    // 预约列表
    diaAppointment() {
      this.viewOrderListVisible = true;
      this.getRemains();
    },
    getRowKey(row) {
      return row.id;
    },
    selectChange(arr, row) {
      this.selectDataArrL = arr;
    },
    selectAll(arr) {
      if (arr.length > 0) {
        this.selectDataArrL = arr;
      }
    },
    // 批量删除
    delAll() {
      let i = this.selectDataArrL.map(item => {
        return item.id;
      });
      edreserve(i).then(res => {
        if (res.code == "200") {
          this.$refs.table.clearSelection();
          this.getRemains();
          this.$message.success("操作成功");
        } else {
          this.$message.error("操作失败");
        }
      });
    },
    remindAll() {
      let i = this.selectDataArrL.map(item => {
        return item.id;
      });
      edreserve(i).then(res => {
        if (res.code == "200") {
          this.$refs.table.clearSelection();
          this.getRemains();
          this.$message.success("操作成功");
        } else {
          this.$message.error("操作失败");
        }
      });
    },
    // 打开修改记录弹窗
    logEdit(id) {
      this.loadingE = true;
      this.edPageTotal = 0;
      this.paramsRecord = {
        pageSize: 10,
        pageNum: 1
      };
      // this.customerId = row.id
      this.customerId = id;
      record({
        customerId: this.customerId,
        pageSize: this.paramsRecord.pageSize,
        pageNum: this.paramsRecord.pageNum
      }).then(res => {
        if (res.code == 200) {
          this.recordData = res.rows;
          this.edPageTotal = res.total;
          this.loadingE = false;
        } else {
          this.loadingE = false;
          this.recordData = [];
          this.edPageTotal = 0;
        }
      });
      // this.edDialog = true;
    },
    edPageChange(val) {
      this.paramsRecord.pageNum = val;
      record({
        customerId: this.customerId,
        pageSize: this.paramsRecord.pageSize,
        pageNum: this.paramsRecord.pageNum
      }).then(res => {
        if (res.code == 200) {
          this.recordData = res.rows;
          this.edPageTotal = res.total;
        } else {
          this.recordData = [];
          this.edPageTotal = 0;
        }
      });
    },
    checkPermi,
    checkRole,
    handleSortChange({ column, prop, order }) {
      let data = JSON.parse(JSON.stringify(this.params));
      this.prop = { prop }.prop;
      this.sort = { order }.order;
      data["clouname"] = this.prop;
      data["sort"] = this.sort;
      getData00(data)
        .then(res => {
          console.log(res, "客户管理列表");
          if (res.code == "200") {
            this.tableData = res.rows;
            this.pageTotal = res.total;
            this.loading = false;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    toSameCustomer() {
      this.$router.push({ path: "/sameCustomer" });
    },
    yanzheng() {
      if (this.formData.email) {
        validateEmail({ emails: this.formData.email, type: 1 }).then(res => {
          if (res.code == 200) {
            this.$message.success("邮箱验证通过");
          } else {
            this.$message.danger(res.data.message);
          }
        });
      } else {
        return this.$message.error("邮箱不能为空");
      }
    },
    // getSysUserList() {
    //   listUser1({
    //     pageNum: 1,
    //     pageSize: 1000
    //   }).then(res => {
    //     this.sysUserList = res.rows;
    //   });
    // },
    smallTime(val) {
      return val.substring(0, 10);
    },
    change123(e) {
      console.log(e);
      console.log(this.formData.source);
    },
    translate_sub() {
      let userId = localStorage.getItem("useId");
      let customerId = this.ids;
      addRecord({
        moveUser: this.moveUser,
        customerIds: customerId,
        userId: userId
      }).then(res => {
        if (res.code == 200) {
          this.$message.success("转移申请已提交");
          this.ids = [];
          this.translateVisible = false;
          this.getData00();
        } else {
          this.$message.error(res.msg);
        }
      });
    },
    /** 查询用户列表 */
    peopleList() {
      userList({
        pageNum: 1,
        pageSize: 500
      }).then(response => {
        this.peopleLists = response.data;
      });
    },
    // 获取国家列表
    getCountryList() {
      getCountryList().then(response => {
        this.countryList = response.rows;
      });
    },
    // 国家州的绑定
    choose_country(e) {
      console.log(e);
      // 找到国家对应的洲进行绑定
      var str = this.countryList.find(function(item) {
        return item.country == e;
      });
      this.formData.continent = str.continent;
    },
    translate(row) {
      this.translateVisible = true;
      this.translate_data = row;
      console.log(row);
    },
    // handleCurrentChange888(e){
    //   this.pageNum888=e
    // },
    // 获取客户等级
    grades() {
      list({
        pageNum: 1,
        pageSize: 100
      }).then(response => {
        console.log(response);
        this.levelList = response.rows;
      });
    },
    querySearch(queryString, cb) {
      console.log(queryString, this.labels);
      var restaurants = this.labels;
      var results = queryString
        ? restaurants.filter(this.createFilter(queryString))
        : restaurants;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    createFilter(queryString) {
      return restaurant => {
        return (
          restaurant.context
            .toLowerCase()
            .indexOf(queryString.toLowerCase()) === 0
        );
      };
    },
    getLabels() {
      getLabels({
        pageNum: 1,
        pageSize: 9999
      }).then(res => {
        if (res.code == 200) {
          this.labels = res.rows;
          console.log(this.labels, "标签名称");
        }
      });
    },
    jilu(id1, id2) {
      submitFormadd({
        content: this.cont,
        customerId: id1,
        userId: id2
      }).then(res => {
        if (res.code == 200) {
          this.cont = undefined;
          console.log("保存记录成功");
        }
      });
    },
    getSysUserList() {
      listUser().then(res => {
        this.sysUserList = res.rows;
      });
    },
    export1() {
      console.log("资源导出");
      this.$confirm("是否确认导出客户资源?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          console.log(this.params, "采纳数------------");
          return exportWai(this.params);
        })
        .then(response => {
          console.log(response);
          this.download(response.msg);
        })
        .catch(function() {});
    },
    downLoadPan() {
      console.log("模板下载");
      this.$confirm("是否确认导出模板?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return downLoadPan();
        })
        .then(response => {
          console.log(response);
          this.download(response.msg);
        })
        .catch(function() {});
    },
    qccQueryCount(index, row) {
      if (row.qccQueryCount == 0) {
        console.log("暂无资质");
      } else {
        this.dialogVisible888 = true;
        this.applyListData888 = row.certificateInfo;
      }
    },
    close666() {
      this.uploadFile666 = {};
      this.uploadList = [];
    },
    // 最新新增
    submitForm() {
      if (this.formData.label == null) {
        this.formData.label = "";
      } else {
        this.formData.label = this.formData.label.toString();
      }

      this.formData.customerRole = this.formData.customerRole.toString();
      console.log(this.formData, "biaoda");
      this.$refs["ruleForm"].validate(valid => {
        if (valid) {
          if (!this.formData.id) {
            // this.formData.userId = localStorage.getItem("useId");

            // console.log(this.formData.label);
            submitAptitudeForm(this.formData).then(res => {
              console.log(res);
              if (res.code == 200) {
                this.$message.success(`新增成功`);
                this.dialogVisible = false;
                this.getData00();
              }
            });
          } else {
            this.formData.type = 1;
            console.log(this.formData);
            update(this.formData).then(res => {
              if (res.code == 200) {
                // this.jilu(this.formData.id, this.formData.userId);
                this.$message.success(`修改成功`);
                this.dialogVisible = false;
                this.uploading = false;
                this.getData00();
              }
            });
          }
        }
      });
    },
    allDel(index) {
      if (index == 1) {
        if (this.params.grade == "") {
          this.$message.error(`请在搜索栏中选择想要删除的客户等级!`);
        } else {
          this.$confirm("确定要删除该标签内所有客户信息？", "危险操作", {
            type: "warning"
          })
            .then(() => {
              allDel({
                grade: this.params.grade
              }).then(res => {
                if (res.code == "200") {
                  this.$message.success(`删除成功`);
                  this.params.grade = "";
                  this.getData00();
                } else {
                  this.$message.error(`删除失败`);
                }
              });
            })
            .catch(() => {});
        }
      } else if (index == 2) {
        if (this.params.label == "") {
          this.$message.error(`请输入或者选择标签的完整名称!`);
        } else {
          this.$confirm("确定要删除该等级内所有客户信息？", "危险操作", {
            type: "warning"
          })
            .then(() => {
              allDel({
                label: this.params.label
              }).then(res => {
                if (res.code == "200") {
                  this.$message.success(`删除成功`);
                  this.params.allDel = "";
                  this.getData00();
                } else {
                  this.$message.error(`删除失败`);
                }
              });
            })
            .catch(() => {});
        }
      }
    },
    //申请转移列表select
    /*    getSelectData(){
        this.transferPeopleParams={
            page: 1,
            pageSize: 10,
            companyName:"",
            realName:'',
            grade:''
        }
        this.applyData.ids=[];
        this.getList();
   }, */
    // remoteMethod(query) {
    //   this.options = [];
    //   this.transferPeopleParams.pageNum = 1;
    //   if (query !== "") {
    //     this.transferPeopleParams.companyName = query;
    //     this.getList();
    //   } else {
    //     this.transferPeopleParams.companyName = "";
    //     this.getList();
    //   }
    // },
    // loadmore() {
    //   this.transferPeopleParams.pageNum++;
    //   this.getList();
    // },
    // getList(formData) {
    //   getList(this.transferPeopleParams).then((res) => {
    //     if (res.code == "200") {
    //       if (res.data.results == null) res.data.results = [];
    //       this.options = [...this.options, ...res.data.results];
    //     }
    //   });
    // },
    //execl导出数量
    execlSubmitForm(formName) {
      var _this = this;
      this.$refs[formName].validate(valid => {
        if (valid) {
          let data = this.params;
          if (this.paramsFlag == 0) {
            data.pageSize = this.ExeclParamsdata.ExeclParams;
          } else {
            data.pageSize = this.ExeclParamsdata.ExeclParams;
          }

          execlSubmitForm(data)
            .then(res => {
              if (res.code == "200") {
                if (res.data.results == null) res.data.results = [];
                this.loading = false;

                if (res.data.results.length != 0) {
                  for (var i = 0; i < res.data.results.length; i++) {
                    if (res.data.results[i].grade == 1) {
                      res.data.results[i].levelContent = "D级（未开发）";
                    } else if (res.data.results[i].grade == 2) {
                      res.data.results[i].levelContent = "A级（已合作）";
                    } else if (res.data.results[i].grade == 3) {
                      res.data.results[i].levelContent = "B级（有意向）";
                    } else if (res.data.results[i].grade == 4) {
                      res.data.results[i].levelContent = "C级（已开发）";
                    }
                  }
                }

                require.ensure([], () => {
                  const {
                    export_json_to_excel
                  } = require("../../../assets/vendor/Export2Excel");
                  const tHeader = [
                    "客户名称",
                    "公司名称",
                    "客户等级",
                    "联系方式",
                    "地址",
                    "最近跟进人"
                  ];
                  const filterVal = [
                    "customerName",
                    "companyName",
                    "levelContent",
                    "customerPhone",
                    "addr",
                    "realName"
                  ];
                  const list = res.data.results;
                  const data = this.formatJson(filterVal, list);
                  export_json_to_excel(tHeader, data, "客户表");
                });

                this.addExeclVisible = false;
                this.ExeclParamsdata.ExeclParams = "";
              }
            })
            .catch(() => {
              console.log("error submit!!");
              return false;
            });
        }
      });
    },
    export2Excel() {
      this.addExeclVisible = true;
      this.ExeclParamsdata.ExeclParams = "";
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]));
    },
    // 已提醒
    handleOrderListRemind(index, row) {
      edreserve().then(res => {
        if (res.code == "200") {
          this.$ref.table.clearSelection();
          this.viewOrderListVisible = false;
          this.$message.success("操作成功");
        } else {
          this.$message.error("操作失败");
        }
      });
    },
    //客户预约
    handleOrderListEdit(index, row) {
      this.orderVisible = true;
      this.orderData = {
        remainTime: row.remainTime,
        remark: row.remark,
        customerId: row.customerId
      };
      this.orderDialogStatus = "更新预约";
    },
    handleOrderListDelete(index, row) {
      this.$confirm("此操作将永久删除该记录, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          handleOrderListDelete(row.id).then(res => {
            if (res.code == "200") {
              this.$message({
                type: "success",
                message: "删除成功!"
              });
              this.getRemains();
            } else {
              this.$message({
                type: "info",
                message: "删除失败!"
              });
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    viewOrderList() {
      this.viewOrderListVisible = true;
      this.getRemains();
    },
    getRemains() {
      getRemains(this.orderParams).then(res => {
        this.orderLstData = res.rows;
        this.orderParamsTotal = res.total;
      });
    },
    orderPageChange(val) {
      this.$set(this.orderParams, "pageNum", val);
      this.getRemains();
    },
    handleOrder(index, row) {
      this.orderVisible = true;
      this.orderData = {
        remainTime: "",
        remark: "",
        customerId: row.id
      };
      this.orderDialogStatus = "新增预约";
    },
    orderSubmitForm(formName) {
      var _this = this;
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.isLogin = true;
          console.log(this.orderData);
          orderSubmitForm(this.orderData)
            .then(res => {
              if (res.code != 200) {
                setTimeout(() => {
                  this.isLogin = false;
                  this.$message.error(`${this.orderDialogStatus}失败`);
                }, 0.1 * 1000);
              } else {
                setTimeout(() => {
                  this.isLogin = false;
                  this.$message.success(`${this.orderDialogStatus}成功`);
                  this.orderVisible = false;
                  this.getRemains();
                }, 0.1 * 1000);
              }
            })
            .catch(() => {
              this.isLogin = false;
            });
        }
      });
    },
    handleChange(params) {
      if (params == 2) {
        this.status = "";
      } else {
        this.status = params;
      }
      this.viewApply();
    },
    // 分页导航
    handleCustomerPageChange(val) {
      this.$set(this.customerListParams, "pageNum", val);
      //  this.customerListData()
    },
    //查看申请
    viewApply() {
      this.viewApplyVisible = true;
      if (this.adminId == 1) {
        //管理员
        this.ApplyListParams.sourceUid = "";
        this.ApplyListParams.status = this.status; //要查询
      } else {
        //员工
        this.ApplyListParams.status = "";
        this.ApplyListParams.sourceUid = this.adminId;
      }
      //           this.$axios.post("/customerApply/getApplyList", this.ApplyListParams)
      //               .then((res) => {
      //                this.applyListData=res.data.results;
      //                this.applyListPage=res.data.count;
      //           })
    },
    // 分页导航
    handleApplyPageChange(val) {
      this.$set(this.ApplyListParams, "pageNum", val);
      this.viewApply();
    },
    //提交申请
    // allApply() {
    //   this.applyVisible = true;
    //   this.applyData = {
    //     sourceUid: JSON.parse(localStorage.getItem("adminData")).id,
    //     type: "",
    //     targetUid: "",
    //     ids: "",
    //     reason: "",
    //   };
    // },
    //编辑页面弹窗
    handleViewApply(index, row) {
      this.applyDetailVisible = true;
      this.customerListParams.applyId = row.id;
      //   this.customerListData()
    },
    //       customerListData(){
    //            this.$axios.post("/customerApply/getCustomerList", this.customerListParams)
    //                         .then((res) => {
    //                  this.customerListDataMore=res.data.results;
    //                  this.customerListParamsTotal=res.data.count;
    //            })
    //       },
    //       getSysUserList(){
    //           this.$axios.get('/customerApply/getSysUserList')
    //                 .then((res) => {
    //                   this.sysUserList=res.data;
    //             })
    //       },
    formatState(val) {
      var str = this.statelList.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    //   appleSubmitForm(formName) {
    //         var _this=this;
    //         if(this.applyData.ids.length != 0)  this.applyData.ids= this.applyData.ids.join(',');
    //         this.$refs[formName].validate((valid) => {
    //             if (valid) {
    //             this.isLogin = true;
    //             this.$axios.post("/customerApply/apply", this.applyData)
    //                     .then((res) => {
    //                         if(res.code!=200){
    //                             setTimeout(() =>{
    //                                 this.isLogin = false;
    //                                 this.$message.success(`提交失败`);
    //                             }, 0.1 * 1000 );
    //                         }else{
    //                         setTimeout(() =>{
    //                                 this.isLogin = false;
    //                                 this.$message.success(`提交成功`);
    //                                 this.applyVisible = false;
    //                             }, 0.1 * 1000 );
    //                         }
    //                 })
    //                 .catch(() => {
    //                     this.isLogin = false;
    //                 });
    //             }
    //         });
    //  },
    openSearch() {
      this.openFlag = !this.openFlag;
      this.params = {
        pageNum: 1,
        pageSize: 10,
        userId: 1,
        companyName: "",
        customerName: "",
        email: "",
        grade: "",
        source: "",
        day: null,
        relation: null,
        label: "",
        customerRole: "",
        country: "",
        customerPhone: "",
        userName: "",
        officialWebsite: "",
        ids: ""
      };
    },
    formatLevel(val) {
      var str = this.levelList.find(function(item) {
        return item.gradeValue == val;
      });
      if (str) return str.gradeName;
    },
    formatRole(val) {
      var str = this.levelList3.find(function(item) {
        return item.dictValue == val;
      });
      if (str) return str.dictLabel;
    },
    formatSource(val) {
      var str = this.levelList5.find(function(item) {
        return item.dictValue == val;
      });
      if (str) return str.dictLabel;
    },
    formatType(val) {
      var str = this.levelList2.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    formatState(val) {
      var str = this.stateList.find(function(item) {
        return item.id == val;
      });
      if (str) return str.title;
    },
    cancelData() {
      this.params = {
        pageNum: 1,
        pageSize: 10,
        userId: 1,
        companyName: "",
        customerName: "",
        email: "",
        grade: "",
        source: "",
        day: null,
        relation: null,
        label: "",
        customerRole: "",
        country: "",
        customerPhone: "",
        userName: "",
        officialWebsite: "",
        ids: ""
      };
      this.getData00();
    },
    //合同列表
    handleViewContract(index, row) {
      this.logDiaContractVisible = true;
      this.$refs.mychildlContract.getDataMore(row.id);
      this.corporateNameTitle = row.companyName;
      this.contractFlag = true;
    },
    //关闭合同列表弹窗
    contractCloseDialog() {
      this.logDiaContractVisible = false;
    },
    //日志查看
    handleViewLog(index, row, type) {
      this.logDialogVisible = true;
      if (type == "1") {
        this.$refs.mychildlog.getDataMore(row.id);
      } else {
        this.$refs.mychildlog.getDataMore(row.customerId);
      }
      this.corporateNameTitle =
        "日志查看 " + row.companyName + " - " + row.customerName;
      // +
      // " - " +
      // row.email;
    },
    //关闭日志查看弹窗
    logCloseDialog() {
      this.logDialogVisible = false;
      this.getData00();
    },
    //资质查看
    handleView(index, row) {
      this.viewDialogVisible = true;
      this.$refs.mychild.getDataMore(row.id);
      this.corporateNameTitle = row.companyName;
    },
    //关闭资质查看弹窗
    viewCloseDialog() {
      this.viewDialogVisible = false;
    },
    // 删除操作
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id);
      console.log(this.ids);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    delAllSelection(row) {
      const id = row.id || this.ids;
      this.$confirm("是否确认删除?", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(function() {
          return deleteData(id);
        })
        .then(() => {
          this.getData00();
          this.msgSuccess("删除成功");
        })
        .catch(function() {});
    },
    // 触发搜索按钮
    search() {
      this.$set(this.params, "pageNum", 1);
      this.paramsFlag = 0;
      if (this.params.day) {
        this.params.relation = "0";
      } else {
        this.params.relation = "";
      }
      // this.params.label = this.params.label.toString();
      // this.params.customerRole = this.params.customerRole.toString();
      this.getData00();
    },

    //新增页面弹窗
    handleAdd() {
      this.formData = {};
      this.dialogVisible = true;
      this.title666 = "新增";
    },
    handleEdit(index, row) {
      console.log(777,row);
      this.dialogVisible = true;
      this.title666 = "修改";
      submitAptitudeForm2(row.id).then(res => {
        if (res.code == 200) {
          console.log(res);
          this.formData = res.data;
          this.logEdit(res.data.id);
          this.formData.customerRole = this.formData.customerRole.split(",");
          if (this.formData.label != "") {
            this.formData.label = this.formData.label.split(",");
          }
          console.log(this.formData, "12343");
        } else {
          this.$message.error(res.msg);
        }
      });
    },

    //编辑页面弹窗
    closeDialog() {
      this.dialogVisible = false;
    },
    //获取数据
    getData00() {
      this.$store.state.notice.ifNotice = false;
      if (!this.params.userId) {
        this.params.userId = 1;
      }
      let data = JSON.parse(JSON.stringify(this.params));
      console.log(this.params);
      if (this.params.label != "") {
        data["label"] = this.params.label.join(",");
      }
      if (this.params.customerRole != "") {
        data["customerRole"] = this.params.customerRole.join(",");
      }
      data["clouname"] = this.prop;
      data["sort"] = this.sort;
      getData00(data)
        .then(res => {
          // console.log(res, "客户管理列表");
          if (res.code == "200") {
            this.tableData = res.rows;
            this.pageTotal = res.total;
            this.loading = false;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          return false;
        });
    },
    // 分页导航
    handlePageChange(val) {
      this.$set(this.params, "pageNum", val);
      this.getData00();
    },
    fileExceed() {
      this.$message.error("别贪心！一次只能上传一个哦~");
    },

    // 请求成功
    importSuccess(res) {
      // 后端的返回码--上传成功
      if (res.code == "200") {
        // 显示√图标
        let e = document.getElementsByClassName(
          "el-upload-list__item-status-label"
        );
        e[0].setAttribute("style", "display:block !important");
        // 成功提示
        this.$message.success("上传成功");
        // 重新调用列表请求（代码略）
        this.getList();
        // 后端的返回码--上传失败
      } else {
        // 隐藏√图标
        let e = document.getElementsByClassName(
          "el-upload-list__item-status-label"
        );
        e[0].setAttribute("style", "display:none !important");
        // 失败提示--及后端返回的失败详情
        this.$message.error({
          dangerouslyUseHTMLString: true,
          duration: 4500,
          message: res.remark + ",<br/>请删除上传失败的文件，修改后重新上传"
        });
      }
    },
    // 增加标签
    // up() {
    //   this.dialogVisible555 = false;
    //   let item = this.uploadFile666;
    //   const form = new FormData();
    //   form.append("upfile", item.file);
    //   this.uploading = true;
    //   console.log(form);
    //   uploadFile(0, this.label, form)
    //     .then((res) => {
    //       if (res.code == "200") {
    //         this.$message.success(`数据导入成功`);
    //         this.uploading = false;
    //         this.getData00();
    //       } else {
    //         this.$message.error(`${res.message}`);
    //         this.messageContent = res.message;
    //       }
    //     })
    //     .catch(() => {
    //       console.log("error submit!!");
    //       this.uploading = false;
    //       return false;
    //     });
    // },
    up2() {
      this.dialogVisible666 = false;
      let item = this.uploadFile666;
      const form = new FormData();
      form.append("upfile", item.file);
      this.uploading = true;
      console.log(form);
      uploadFile(1, this.label, form)
        .then(res => {
          if (res.code == "200") {
            this.$message.success(`数据导入成功`);
            this.uploading = false;
            this.getData00();
          } else {
            this.$message.error(`${res.message}`);
            this.messageContent = res.message;
          }
        })
        .catch(() => {
          console.log("error submit!!");
          this.uploading = false;
          return false;
        });
    },
    // 自定义上传
    uploadFile(item) {
      console.log(item);
      this.dialogVisible555 = true;
      this.uploadFile666 = item;
      //   const form = new FormData();
      // form.append("upfile", item.file);
      // this.uploading=true
      // uploadFile(1,this.label,form)
      //   .then((res) => {
      //     if (res.code == "200") {
      //       this.$message.success(`数据导入成功`)
      //       this.uploading=false
      //       this.getData00();
      //     } else {
      //       this.$message.error(`${res.message}`);
      //       this.messageContent = res.message;
      //     }
      //   })
      //   .catch(() => {
      //     console.log("error submit!!");
      //     this.uploading=false
      //     return false;
      //   });
    },
    uploadFile2(item) {
      console.log(item);
      this.dialogVisible666 = true;
      this.uploadFile666 = item;
    }
  }
};
function formatDate(value) {
  let date = new Date(parseInt(value) * 1000);
  let y = date.getFullYear();
  let m = date.getMonth() + 1;
  m = m < 10 ? "0" + m : m;
  let d = date.getDate();
  d = d < 10 ? "0" + d : d;
  return y + "-" + m + "-" + d;

  /*  let date = new Date(parseInt(value) * 1000)
    let y = date.getFullYear();
    let m = date.getMonth() + 1;
    m = m < 10 ? ('0' + m) : m;
    let d = date.getDate();
    d = d < 10 ? ('0' + d) : d;
    let h = date.getHours();
    h = h < 10 ? ('0' + h) : h;
    let minute = date.getMinutes();
    let second = date.getSeconds();
    minute = minute < 10 ? ('0' + minute) : minute;
    second = second < 10 ? ('0' + second) : second;
    return  y + '-' + m + '-' + d + ' '+ h + ':' + minute + ':' + second*/
}
</script>

<style scoped>
/* 上传 */
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9 !important;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  border: 1px dashed #d9d9d9 !important;
  font-size: 28px;
  color: #8c939d;
  width: 120px;
  height: 120px;
  line-height: 120px;
  text-align: center;
}
.avatar {
  width: 120px;
  height: 120px;
  display: block;
}
/* 公司证书 */
::v-deep .el-form-item__content {
  display: flex;
}
::v-deep .el-icon-circle-close:before {
  color: #fff;
}
/* // 重写展开icon  单个修改icon样式*/
::v-deep .el-icon-arrow-right::before {
  color: #1890ff;
  font-size: 20px;
}
::v-deep .el-table__expand-icon--expanded {
  transform: translate(4px, 6px) rotate(-180deg);
}
::v-deep .el-table__expand-icon .el-icon-arrow-right::before {
  content: "\e790";
}
/* icon end */
/* 弹框里面的按钮 */
::v-deep .el-dialog__footer {
  margin-top: 50px;
}
.container {
  padding: 0 20px !important;
}
.timeDate .el-date-editor {
  width: 50%;
  float: left;
}
.handle-box .el-button + .el-button {
  margin-left: 0px !important;
}
.form-box,
.el-select {
  width: 100% !important;
}
.handle-box {
  margin-bottom: 10px;
}

.handle-select {
  width: 120px;
}

.handle-input {
  width: 300px;
  display: inline-block;
}
.table {
  width: 100%;
  padding: 0 !important;
  font-size: 14px;
}

.yellow {
  color: #f57506;
}
.green {
  color: green;
  cursor: pointer;
}
.red {
  color: #ff0000;
}
.blue {
  color: #409eff;
  cursor: pointer;
  text-decoration: underline;
}
.blue1 {
  color: #409eff;
}
.mr10 {
  margin-right: 10px;
}
.table-td-thumb {
  display: block;
  margin: auto;
  width: 40px;
  height: 40px;
}
.search-box {
  margin-bottom: 10px;
  padding: 10px 10px 10px 10px;
  border-radius: 4px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
}
.searchForm .el-form-item--mini.el-form-item,
.searchForm .el-form-item--small.el-form-item {
  margin-bottom: 1px;
}
</style>
<style>
.el-tooltip__popper {
  max-width: 500px;
}
.el-dialog__body {
  padding: 10px 20px;
}

#inputText {
  /* height: 400px !important; */
}
</style>
